<!DOCTYPE html>
<html lang="en">
  <head>
      {{template "commonHeader.html" .}}
    </head>
<body id="top">

  {{template "nav.html" .}}

  <div class="bg-videosnap"></div>
  <video playsinline autoplay muted loop class="bg-video">
    <source src="/static/images/helloworld.mp4" type="video/mp4" />Your browser does not support the video tag. I suggest you upgrade your browser.
    <source src="/static/images/helloworld.webm" type="video/webm" />Your browser does not support the video tag. I suggest you upgrade your browser.
  </video>

  <section class="hero container">
    <div id="hero" class="text-center">
        <img src="/static/images/favicon-96x96.png" />
        <h1 class="animated swing delay-1s">ignite<span>V1</span></h1>
        <p>A dockernized service for <em>SS</em></p>
        <div class="col-md-6 offset-md-3 text-center">
          {{ if not .uInfo }}
          <a href="#" class="signup-btn signup-move">激活账号</a>
          <p class="login-text">已注册用户，点击 <em><a class="login-move signup-loginhref" href="#">此处</a></em> 登录</p>
          {{ else }}
          <a href="/panel/index" class="signup-btn">控制台</a> {{ end }}
        </div>
    </div>
    <div class="text-center" id="signup">
      <form class="form" id="signup-form" action="/signup" method="post">
        <h1>激活账号</h1>
        <input type="text" placeholder="邀请码" name="invite-code">
        <input type="text" placeholder="用户名" name="username">
        <input type="password" placeholder="密码" name="password">
        <input type="password" placeholder="确认密码" name="confirm-password">
        <button id="signup-btn" class="common-btn">激活</button>
      </form>
    </div>
    <div class="text-center" id="login">
      <form class="form" id="login-form" action="/login" method="post">
        <h1>用户登录</h1>
        <input type="text" placeholder="用户名" name="username">
        <input type="password" placeholder="密码" name="password">
        <button id="login-btn" class="common-btn">登录</button>
      </form>
    </div>
  </section>

  {{ template "commonFooter.html" .}}
  <script src="/static/js/scripts.js"></script>
  <script src="/static/js/user.js"></script>

  <script>
    (function(){
      User.init();
      Header.init();
      var videoElm = window.os.isPc ? '.bg-video' : '.bg-videosnap';
      document.querySelector(videoElm).style.display = 'block';
    })()
  </script>
</body>

</html>
